<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + request.getContextPath() + "/";
%>
<!DOCTYPE html>
<html>
<head>
    <base href="<%=basePath%>">
    <meta charset="UTF-8">
    <link href="jquery/bootstrap_3.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet"/>
    <link href="jquery/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css" type="text/css"
          rel="stylesheet"/>

    <script type="text/javascript" src="jquery/jquery-1.11.1-min.js"></script>
    <script type="text/javascript" src="jquery/bootstrap_3.3.0/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="jquery/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.js"></script>
    <script type="text/javascript"
            src="jquery/bootstrap-datetimepicker-master/locale/bootstrap-datetimepicker.zh-CN.js"></script>

    <link rel="stylesheet" type="text/css" href="jquery/bs_pagination/jquery.bs_pagination.min.css">
    <script type="text/javascript" src="jquery/bs_pagination/jquery.bs_pagination.min.js"></script>
    <script type="text/javascript" src="jquery/bs_pagination/en.js"></script>

    <script type="text/javascript">
        $(function () {

            $(".time1").datetimepicker({
                minView: "month",
                language: 'zh-CN',
                format: 'yyyy-mm-dd',
                autoclose: true,
                todayBtn: true,
                pickerPosition: "bottom-left"
            });

            $(".time2").datetimepicker({
                minView: "month",
                language: 'zh-CN',
                format: 'yyyy-mm-dd',
                autoclose: true,
                todayBtn: true,
                pickerPosition: "top-left"
            });

            $("#aname2").keydown(function (event) {

                if (event.keyCode == 13) {

                    $.ajax({

                        url: "workbench/contacts/getContactsListByName.do",
                        data: {

                            "aname2": $.trim($("#aname2").val()),
                            "tranId" : "${v.tranId}"

                        },
                        type: "get",
                        dataType: "json",
                        success: function (data) {

                            var html = "";

                            $.each(data, function (i, n) {

                                html += '<tr>';
                                html += '<td><input type="radio" name="xz" value="' + n.id + '"/></td>';
                                html += '<td id="' + n.id + '">' + n.fullname + '</td>';
                                html += '<td>' + n.email + '</td>';
                                html += '<td>' + n.mphone + '</td>';
                                html += '</tr>';

                            })

                            $("#contactsSearchBody").html(html);


                        }

                    })


                    return false;

                }

            })

            $("#submitContactsBtn").click(function () {

                //取得选中市场活动的id
                var $xz = $("input[name=xz]:checked");
                var id = $xz.val();

                //取得选中市场活动的名字
                var name = $("#" + id).html();

                //将以上两项信息填写到 交易表单的市场活动源中
                $("#edit-contactsId").val(id);
                $("#edit-contacts").val(name);

                //将模态窗口关闭掉
                $("#searchContactsModal").modal("hide");

            })

            $("#reminderTime").click(function () {
                if (this.checked) {
                    $("#reminderTimeDiv").show("200");
                } else {
                    $("#reminderTimeDiv").hide("200");
                }
            });

            //为更新按钮绑定事件，执行交易的修改操作
            $("#updateBtn").click(function () {

                var tag = "${tag}";
                var id = $.trim($("#edit-id").val());
                //alert(tag);
                $.ajax({

                    url: "workbench/visit/update.do",
                    data: {

                        "tag": tag,
                        "id": id,
                        "owner": $.trim($("#edit-owner").val()),
                        "subject": $.trim($("#edit-subject").val()),
                        "expiryDate": $.trim($("#edit-expiryDate").val()),
                        "contactsId": $.trim($("#edit-contactsId").val()),
                        "state": $.trim($("#edit-state").val()),
                        "priority": $.trim($("#edit-priority").val()),
                        "description": $.trim($("#edit-description").val()),
                        "startTime": $.trim($("#edit-startTime").val()),
                        "repeatType": $.trim($("#edit-repeatType").val()),
                        "noticeType": $.trim($("#edit-noticeType").val())

                    },
                    type: "post",
                    dataType: "json",
                    success: function (data) {

                        if (data.success) {

                            if (tag != "0") {
                                window.location.href = "workbench/visit/index.jsp";
                            } else {
                                window.location.href = "workbench/visit/detail.do?id=" + id;
                            }

                        } else {

                            alert("修改售后处理失败");

                        }

                    }

                })

            })
        });
    </script>
</head>
<body>

    <!-- 查找联系人 -->
    <div class="modal fade" id="searchContactsModal" role="dialog">
        <div class="modal-dialog" role="document" style="width: 80%;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">×</span>
                    </button>
                    <h4 class="modal-title">查找联系人</h4>
                </div>
                <div class="modal-body">
                    <div class="btn-group" style="position: relative; top: 18%; left: 8px;">
                        <form class="form-inline" role="form">
                            <div class="form-group has-feedback">
                                <input type="text" id="aname2" class="form-control" style="width: 300px;"
                                       placeholder="请输入联系人名称">
                                <span class="glyphicon glyphicon-search form-control-feedback"></span>
                            </div>
                        </form>
                    </div>
                    <table id="activityTable" class="table table-hover" style="width: 900px; position: relative;top: 10px;">
                        <thead>
                        <tr style="color: #B3B3B3;">
                            <td></td>
                            <td>名称</td>
                            <td>邮箱</td>
                            <td>手机</td>
                        </tr>
                        </thead>
                        <tbody id="contactsSearchBody">

                        </tbody>
                    </table>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" id="submitContactsBtn">提交</button>
                </div>
            </div>
        </div>
    </div>

    <div style="position:  relative; left: 30px;">
        <h3>修改任务</h3>
        <div style="position: relative; top: -40px; left: 70%;">
            <button type="button" class="btn btn-primary" data-dismiss="modal" id="updateBtn">更新</button>
            <a href="javascript:history.go(-1);" class="btn btn-default" type="button">取消</a>
        </div>
        <hr style="position: relative; top: -40px;">
    </div>
    <form class="form-horizontal" role="form">
        <input type="hidden" id="edit-id" value="${v.id}"/>
        <div class="form-group">
            <label for="edit-owner" class="col-sm-2 control-label">任务所有者<span style="font-size: 15px; color: red;">*</span></label>
            <div class="col-sm-10" style="width: 300px;">
                <select class="form-control" id="edit-owner">
                    <option></option>
                    <c:forEach items="${uList}" var="u">
                        <option value="${u.id}" ${v.owner eq u.name ? "selected" : ""}>${u.name}</option>
                    </c:forEach>
                </select>
            </div>
            <label for="edit-subject" class="col-sm-2 control-label">主题<span
                    style="font-size: 15px; color: red;">*</span></label>
            <div class="col-sm-10" style="width: 300px;">
                <input type="text" class="form-control" id="edit-subject" value="${v.subject}">
            </div>
        </div>
        <div class="form-group">
            <label for="edit-expiryDate" class="col-sm-2 control-label">到期日期</label>
            <div class="col-sm-10" style="width: 300px;">
                <input type="text" class="form-control time1" id="edit-expiryDate" value="${v.expiryDate}">
            </div>
            <label for="edit-contacts" class="col-sm-2 control-label">联系人&nbsp;&nbsp;<a href="javascript:void(0);"
                                                                                        data-toggle="modal"
                                                                                        data-target="#searchContactsModal"><span
                    class="glyphicon glyphicon-search"></span></a></label>
            <div class="col-sm-10" style="width: 300px;">
                <input type="text" class="form-control" id="edit-contacts" value="${con.fullname}" readonly>
                <input type="hidden" id="edit-contactsId" name="contactsId" value="${v.contactsId}"/>
            </div>
        </div>

        <div class="form-group">
            <label for="edit-state" class="col-sm-2 control-label">状态</label>
            <div class="col-sm-10" style="width: 300px;">
                <select class="form-control" id="edit-state">
                    <option></option>
                    <c:forEach items="${returnStateList}" var="rs">
                        <option value="${rs.value}" ${v.state eq rs.value ? "selected" : ""}>${rs.text}</option>
                    </c:forEach>
                </select>
            </div>
            <label for="edit-priority" class="col-sm-2 control-label">优先级</label>
            <div class="col-sm-10" style="width: 300px;">
                <select class="form-control" id="edit-priority">
                    <option></option>
                    <c:forEach items="${returnPriorityList}" var="rp">
                        <option value="${rp.value}" ${v.priority eq rp.value ? "selected" : ""}>${rp.text}</option>
                    </c:forEach>
                </select>
            </div>
        </div>

        <div class="form-group">
            <label for="edit-description" class="col-sm-2 control-label">描述</label>
            <div class="col-sm-10" style="width: 70%;">
                <textarea class="form-control" rows="3" id="edit-description">${v.description}</textarea>
            </div>
        </div>

        <div style="position: relative; left: 103px;">
            <span><b>提醒时间</b></span>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <input type="checkbox" id="reminderTime" checked>
        </div>

        <div id="reminderTimeDiv"
             style="width: 500px; height: 180px; background-color: #EEEEEE; position: relative; left: 185px; top: 20px;">
            <div class="form-group" style="position: relative; top: 10px;">
                <label for="edit-startTime" class="col-sm-2 control-label">开始日期</label>
                <div class="col-sm-10" style="width: 300px;">
                    <input type="text" class="form-control time2" id="edit-startTime" value="${v.startTime}">
                </div>
            </div>

            <div class="form-group" style="position: relative; top: 15px;">
                <label for="edit-repeatType" class="col-sm-2 control-label">重复类型</label>
                <div class="col-sm-10" style="width: 300px;">
                    <select class="form-control" id="edit-repeatType">
                        <option></option>
                        <c:forEach items="${repeatTypeList}" var="rt">
                            <option value="${rt.value}" ${v.repeatType eq rt.value ? "selected" : ""}>${rt.text}</option>
                        </c:forEach>
                    </select>
                </div>
            </div>

            <div class="form-group" style="position: relative; top: 20px;">
                <label for="edit-noticeType" class="col-sm-2 control-label">通知类型</label>
                <div class="col-sm-10" style="width: 300px;">
                    <select class="form-control" id="edit-noticeType">
                        <option></option>
                        <c:forEach items="${noticeTypeList}" var="nt">
                            <option value="${nt.value}" ${v.noticeType eq nt.value ? "selected" : ""}>${nt.text}</option>
                        </c:forEach>
                    </select>
                </div>
            </div>
        </div>
    </form>

    <div style="height: 200px;"></div>
</body>
</html>